<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Welcome</title>
</head>
<style>
  .top{
    width: 700px; 
    height: 130px;
    margin: 0 auto;
    text-align:center;
    font-size:20px;
    display: flex;
  }
  .img{
    margin-left: 0;
    width: 200px; 
    height: 100px;
  }
  .welcome{
     width: 450px; 
     height: 300px;
     margin: 0 auto;
     text-align:center;
     line-height:35px;
     border:1px solid #aaa;
     box-shadow:0 0px 10px #aaa;
     border-radius:15px;
  }
  .button{
     width: 90px; 
     height: 30px;
     margin: 0 auto;
     text-align:center;
     border:1px solid #aaa;
     box-shadow:0 0px 10px #aaa;
  }
  a:link,a:visited{
     text-decoration:none; 
     color:#000;
  }
</style>
<body>
  <div class="top">
    <div class="img">
       <img th:src="@{/images/1.jpg}"  width="180" height="100"/>
    </div>
   
    <h1 align="center">欢迎进来选课系统!</h1>
  </div>
  
  <div class="welcome">
    <br>
    <span>欢迎同学们来到选课系统~</span>
    <br>
    <span>大致讲讲这个系统如何操作的~</span>
    <br>
    <span>首先，是欢迎页面！请点击选课的按钮！</span>
    <br>
    <span>其次，就会跳转到选课信息页面！记得选课哦~</span>
    <br>
    <span>接着，就会到个人信息页面！要注意检查填入的信息~</span>
    <br>
    <span>最后，就来到了展示结果页面：个人信息+选课信息！</span>
  </div>
  <br>
  <div class="button">
  <a th:href="@{/choose}">选课</a><br/>
  </div>
</body>
</html>